<!DOCTYPE html>
<title>SwitchMap Tests</title>
<style>
    html, body {
        width:  100%;
        height: 100%;
        margin: 0px;
    }
    pre {
        font-size: 90%;
        overflow-y:visible;
    }
    canvas {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1.0;
    }
</style>
<script src="../src/ObjectContainer.js"></script>
<script src="../src/EventSet.js"></script>
<script src="../src/KeyboardInput.js"></script>
<script src="../src/MouseInput.js"></script>
<script src="../src/Screen.js"></script>
<script src="../src/SwitchMap.js"></script>
<script>
    window.addEventListener('load', function ( ) {
        log = document.querySelector('pre');
        canvas = document.querySelector('canvas');
        sm = new SwitchMap();
        kb = new KeyboardInput();
        mb = new MouseInput(new Screen(canvas));

        sm.addSource(kb.on.get('down'), kb.on.get('up'), KeyboardInput.keyMap);
        sm.addSource(mb.on.get('down'), mb.on.get('up'), MouseInput.mouseMap);
        sm.addSwitch(['CAPS_LOCK', 'NUM_LOCK', 'SCROLL_LOCK']);
        
        sm.on.down(function (info) { log.appendChild(document.createTextNode(info.which + ' is pressed. (' + info.time +")\n")); window.scrollTo(0,document.body.scrollHeight); });
        sm.on.up(function (info) { log.appendChild(document.createTextNode(info.which + ' is released. (' + info.time +")\n")); window.scrollTo(0,document.body.scrollHeight); });
        sm.on.on(function (info) { log.appendChild(document.createTextNode(info.which + ' is on. (' + info.time +")\n")); window.scrollTo(0,document.body.scrollHeight); });
        sm.on.off(function (info) { log.appendChild(document.createTextNode(info.which + ' is off. (' + info.time +")\n")); window.scrollTo(0,document.body.scrollHeight); });
    });
</script>
<canvas></canvas>
<pre></pre>